<!DOCTYPE html>
<html layout:decorator="wechat/appointment/layout">
<head>
    <title>Task List</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <!-- <meta name="_csrf" th:content="${_csrf.token}"/>
    default header name is X-CSRF-TOKEN
    <meta name="_csrf_header" content="${_csrf.headerName}"/> -->
</head>
<body>

<div layout:fragment="content">

	<div layout:include="fragments/model :: model" th:with="modelID='appointment_model', title='提示信息', content=''" th:remove="tag"/>	 
	
	<th:block th:if="${message != null}">	
        <!--/* The message code is returned from the @Controller */-->
        <div th:replace="fragments/alert :: alert">&nbsp;</div>
    </th:block>

	<form id="appointmentForm" name="appointmentForm" action="#" th:action="@{/wechat/appointment_alljk/list/1}" method="post">	
		<div class="well">		
			<label th:text="#{menu.appointment.c1}">姓名</label><input type="text" name="_P_NAME" th:value="${params['_P_NAME']}"></input>
		  	<label th:text="#{menu.appointment.c5}">联系电话</label><input type="text" name="_P_TELPHONE" th:value="${params['_P_TELPHONE']}"></input>
		  	
		  	
		  	<div class="pull-right">
			  	<button type="submit" class="btn btn-default" th:text="#{form.search}">查询</button>	  
		    	<a th:href="@{/wechat/appointment_alljk/new}" class="btn btn-default"  th:text="#{form.new}">新建预约</a>
		    	<button type="button" class="btn btn-default" onclick="del()" th:text="#{form.del}">删除预约</button>
			</div>
        </div>
		<div id="dataList" >
			<div th:fragment="dataList">
			    <table class="table table-bordered table-striped" >
			        <thead>
			        <tr>
			            <td class="table-id">ID</td>
			            <td th:text="#{menu.appointment.c1}">姓名</td>
			            <td th:text="#{menu.appointment.c2}">业务类型</td>
<!-- 			            <td th:text="#{menu.appointment.c3}">身份类型</td>
			            <td th:text="#{menu.appointment.c4}">身份号码</td> -->
			            <td th:text="#{menu.appointment.c5}">联系电话</td>
			            <td>回复预约</td>
			            <td th:text="#{menu.appointment.c7}">状态</td>
			        </tr>
			        </thead>
			        <tbody>
			        <tr th:if="${appointments.empty}">
			            <td colspan="8" th:text="#{form.empty}">没有记录</td>
			        </tr>
			        <tr th:each="appointment : ${appointments}">
			            <td><input type="checkbox" th:value="${appointment.id}" th:id="${'chk-' + appointment.id}" name="chk"/></td>
			            <td><a th:href="@{'/wechat/appointment_alljk/edit/' + ${appointment.id}}" th:id="${'name' + appointment.id}" th:text="${appointment.name}">Name ...</a></td>
			            <td th:text="${appointment.businessType}">BusinessType ...</td>
<!-- 			            <td th:text="${appointment.idType}">Type ...</td>
			            <td th:text="${appointment.idTypeNo}">Type no ...</td> -->
			            <td th:text="${appointment.telphone}">Telphone ...</td>
			            <td th:text="${#dates.format(appointment.theDate, 'yyyy-MM-dd HH:mm')}">2014-04-24 00:50</td>
			            <td th:text="${appointment.status}">Status ...</td>
			        </tr>
			        </tbody>
			    </table>
			    <div th:utext="${paginationBean.pagination()}" class="text-center"></div>
		    </div>
	    </div>
	</form>
	
<script>
function pagination(formName,targetName,pageNo){	
	var options = {
            url: '/wechat/wechat/appointment/list/a/'+pageNo ,
            type: 'post',
           /*  beforeSend:function(xhr){
            	 var token = $("meta[name='_csrf']").attr("content");
            	 var header = $("meta[name='_csrf_header']").attr("content");
            	 xhr.setRequestHeader(header, token);
            }, */
            dataType: 'html',
            data: $("#"+formName).serialize(),
            success: function (data) {
                if (data.length > 0)
                    $("#"+targetName).html(data);
            }
        };
	
	$.ajax(options);
}

function del(){
	var formName = "#appointmentForm";
	var modelId = "#appointment_model";
    var count = $(formName).find('input:checked[name="chk"]').length;
    if(count==0) {return ;}
    $(modelId).modal("toggle");
    var title = '<th:block th:text="#{form.del.confirm}"></th:block>';
    var content = '<th:block th:text="#{form.del.count}"></th:block>';
    content = content.replace("##"," " + count + " ");
    
    content+="<ul>";
    $(formName +" input[name='chk']").each(function(){
        if(this.checked){
        var chkId=$(this).attr("id").substring(4);
        content+="<li>"+$("#name"+chkId).text()+"</li>";
        }
    });
    content+="</ul>";
    
    $(modelId + "_title").html(title);
    $(modelId + "_body").html(content);
    $(modelId + "_cf").click(function(){            
      $(formName)[0].action="/wechat/wechat/appointment_alljk/del";
      $(formName)[0].method = "post";
      $(formName)[0].submit();
    });
    };

</script>
	
</div>

</body>
</html>